<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style>
			*{margin: 0;padding: 0;}
			img{float: left;
			}li{
				float:left;
				list-style: none;}
			#box{
				width: 840px;
				height: 40px; 
				background: gray;}
			#box ul li a{
				text-decoration: none;
				margin: 0 9px 0 9px;
			line-height: 40px;
			color: white;
			font-size: 12px;}
			#box ul li a:hover{color: red;}
			#box ul li a .one{display: inline-block;
			height: 25px;
			width: 50px;
			border: 1px solid yellow;
			border-radius: 12px;
			line-height: 25px;
			text-align: center;
			color: yellow;}
			#box ul li a .two{display: inline-block;
			height: 25px;
			width: 90px;
			border: 1px;
			border-radius: 12px;
			line-height: 25px;
			text-align: center;
			color: gold;
			background:goldenrod;
			}#box ul li a .one:hover{color: blue;}
			#box ul li a .two:hover{color: blue;}
		</style>
	</head>
	<body>
		<div id="box">
			<img src="img/logo.png" alt="" height="40px" width="60px"> 
			<ul>				
				<li><a href="#">功能特权</a></li>
				<li><a href="#">游戏特权</a></li>
				<li><a href="#">生活特权</a></li>
				<li><a href="#">会员活动</a></li>
				<li><a href="#">成长体系</a></li>
				<li><a href="#">年费专区</a></li>
				<li><a href="#">超级会员</a></li>
				<li><a href="#">超级会员</a></li>
				<li><a href="#">会员活动</a></li>
				<li><a href="#"><span class="one">登录</span></a></li>
				<li><a href="#"><span class="two">开通超级会员</span></a></li>
			</ul>			
		</div>
	</body>
</html>